<template>
  <div>
    <a-input-search v-model="selectedDepUsers.realname" placeholder="请选择" read-only @search="onSearchDepUser">
      <a-button slot="enterButton" :disabled="disabled">选择</a-button>
    </a-input-search>
    <j-select-user-type-modal ref="selectModal" :modal-width="modalWidth" @ok="onSearchDepUserCallBack" />
  </div>
</template>

<script>
import JSelectUserTypeModal from './modal/JSelectUserTypeModal'
export default {
  name: 'JSelectUserByType',
  components: { JSelectUserTypeModal },
  props: {
    modalWidth: {
      type: Number,
      default: 1250,
      required: false,
    },
    disabled: {
      type: Boolean,
      required: false,
      default: false,
    },
    value: {
      type: Object,
      required: false,
      default: false,
    },
    queryPersonState: {
      type:Number,
      required:false,
      default:false,
    }
  },
  data() {
    return {
      selectedDepUsers: '',
    }
  },
  mounted() {
    this.selectedDepUsers = this.value
  },
  watch: {
    value(val) {
      this.selectedDepUsers = val ? val : '请选择用户'
    },
  },
  methods: {
    //通过组织机构筛选选择用户
    onSearchDepUser() {
      this.$refs.selectModal.showModal(this.queryPersonState)
    },
    onSearchDepUserCallBack(selectedDepUsers) {
      this.selectedDepUsers = selectedDepUsers ? selectedDepUsers : this.selectedDepUsers
      this.$emit('userMessage', selectedDepUsers)
    },
  },
}
</script>

<style scoped>
</style>